<template>
  <div>
    <table class="table table-sm table-bordered approve-table">
      <colgroup>
        <col width="20%" />
        <col width="30%" />
        <col width="20%" />
        <col width="30%" />
      </colgroup>
      <tbody>
        <tr>
          <td colspan="4" class="text-center border-0">
            <h5>业务审批表</h5>
          </td>
        </tr>
        <!-- <tr class="bg-light">
          <td colspan="4" class="text-center py-2">基本信息</td>
        </tr> -->
        <tr>
          <td>申请人</td>
          <td>{{ infoData.enterprise_name }}</td>
          <td>申请时间</td>
          <td>{{ infoData.create_time }}</td>
        </tr>
        <tr>
          <td>营业执照</td>
          <td>{{ infoData.enterprise_code }}</td>
          <td>联系电话</td>
          <td>{{ infoData.agent_phone }}</td>
        </tr>
        <tr>
          <td>担保金额</td>
          <td>{{ infoData.tender_bond }} 元</td>
          <td>担保费</td>
          <td>{{ infoData.gua_fee }} 元</td>
        </tr>
        <tr>
          <td>开标时间</td>
          <td>{{ openTime }}</td>
          <td>投标有效期</td>
          <td>{{ tenderMonths }} 个月 ({{ infoData.tender_expire }} 天)</td>
        </tr>
        <!-- <tr>
          <td>附件信息</td>
          <td colspan="3" class="text-left">
            <attach-main
              :related-id="queryId"
              :entrust-id="infoData.doc_id"
              :letter-id="infoData.doc_id_bh"
            ></attach-main>
          </td>
        </tr> -->
      </tbody>
    </table>
  </div>
</template>

<script>
// import AttachMain from '@/bigcredit/views/letter/apply/accept/AttachMain'
export default {
  components: {
    // AttachMain,
  },
  props: {
    queryId: String,
  },
  data() {
    return {
      tableName: 'guarantee_project',
      loading: false,
      infoData: {},
    }
  },
  computed: {
    tenderMonths() {
      return Math.round(this.infoData.tender_expire / 30)
    },
    openTime() {
      const date = this.infoData.open_time || ''
      return `${date.substring(0, 4)}-${date.substring(4, 6)}-${date.substring(
        6,
        8
      )} ${date.substring(8, 10)}:${date.substring(10, 12)}`
    },
  },
  watch: {
    queryId: {
      handler: function () {
        this.getData()
      },
      immediate: true,
    },
  },
  created() {},
  mounted() {},
  methods: {
    getData() {
      if (!this.queryId) {
        return
      }
      this.loading = true
      this.$api
        .getDataFromId(this.$serviceName, this.tableName, this.queryId)
        .then(res => {
          this.infoData = res?.data ?? {}
        })
        .finally(() => {
          this.loading = false
        })
    },
  },
}
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>
